<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./1.css">
    <style>
        .innerStyle {
            text-align: center;
            text-shadow: 1px 1px rgba(0, 0, 0, .5), 2px 2px rgba(0, 0, 0, .5);
            color: skyblue;
            background-color: pink;
        }

        a {
            transition: all .5s;
        }

        /* 伪类选择器 */

        /* 未点击 */
        a:link {
            color: #6cf;
        }

        /* 鼠标经过 */
        a:hover {
            color: #6cf;
            font-size: 30px;

        }

        /* 点击后 */
        a:visited {
            color: #ccc;
        }

        /* 第一个字 */
        p:first-letter {
            font-size: 30px;
        }
    </style>

</head>

<body>
    <h2 style="font-size: 30px; color: red; text-align: center;background-color: #6cf;">内嵌样式</h2>

    <h2 class="innerStyle">内部样式</h2>

    <h2 class="outStyle">外部样式</h2>

    <a href="https://www.baidu.com">去百度</a>

    <p>hello world</p>
</body>

</html>